import { useState, useEffect, useCallback } from 'react';
import { message } from 'antd';
import { getDepartmentTree, Department } from '@/services/department';

/**
 * 部门树形数据管理Hook
 * 演示完整的API调用流程：Hook -> Service -> Request -> 后端
 */
export const useDepartmentTree = () => {
  const [treeData, setTreeData] = useState<Department[]>([]); // 树形数据状态
  const [loading, setLoading] = useState<boolean>(false); // 加载状态
  const [error, setError] = useState<string | null>(null); // 错误状态

  /**
   * 获取部门树形数据
   * 完整的请求流程演示
   */
  const fetchDepartmentTree = useCallback(async () => {
    try {
      setLoading(true); // 开始加载
      setError(null); // 清除之前的错误
      
      // 调用API服务 -> 发送HTTP请求 -> 后端处理 -> 返回数据
      const departments = await getDepartmentTree();
      
      setTreeData(departments); // 更新数据状态
      message.success('组织架构数据加载成功'); // 用户提示
    } catch (err) {
      // 错误处理：网络错误、后端错误、Token过期等
      const errorMsg = err instanceof Error ? err.message : '获取组织架构数据失败';
      setError(errorMsg);
      message.error(errorMsg);
      console.error('获取部门树形数据失败:', err);
    } finally {
      setLoading(false); // 结束加载状态
    }
  }, []);

  /**
   * 刷新数据
   */
  const refresh = useCallback(() => {
    fetchDepartmentTree();
  }, [fetchDepartmentTree]);

  // 组件挂载时自动获取数据
  useEffect(() => {
    fetchDepartmentTree();
  }, [fetchDepartmentTree]);

  return {
    treeData, // 部门树形数据
    loading,  // 加载状态
    error,    // 错误信息
    refresh,  // 刷新方法
  };
};